/**
 * 建筑用能=>能源流向图
 */
import { Component } from "react";
import { message } from "antd";
import FlowDiagramCondition, {
  FlowDiagramConditionParam,
} from "./compontents/Condition";
import "./index.less";
import { getNetWorkData } from "../../../../utils/common";
import { getFlowDiagramUrl } from "./compontents/serverApi";
import * as React from "react";
import { FlowDiagramCharts } from "./compontents/Echarts/FlowDiagramCharts";

export interface FlowDiagramProps {}

export interface FlowDiagramState {
  nodes: any;
  links: any;
}

class FlowDiagram extends Component<FlowDiagramProps, FlowDiagramState> {
  public buildNames: string[] = [];
  state = { nodes: [], links: [] };

  render() {
    return (
      <div className="flowDiagram">
        <FlowDiagramCondition
          buildNames={this.buildNames}
          query={(paramJson: FlowDiagramConditionParam) => {
            this.query(paramJson);
          }}
        />
        <div className="subject" style={{ height: "calc(100vh - 320px)" }}>
          <FlowDiagramCharts
            nodes={this.state.nodes}
            links={this.state.links}
          />
        </div>
      </div>
    );
  }

  //查询
  query(paramJson: FlowDiagramConditionParam) {
    if (!paramJson.buildId && paramJson.buildId !== 0) {
      message.info("请选择建筑！");
      return;
    }
    if (paramJson.startTime === 0 || paramJson.endTime === 0) {
      message.info("请选择时间！");
      return;
    }
    getNetWorkData(getFlowDiagramUrl, paramJson, this, (result) => {
      if (result && result.data) {
        let nodes = result.data.nodes;
        let links = result.data.links;
        //选择顶节点时：所有一级节点求和
        if (paramJson.buildId === 0) {
          let total = 0;
          nodes.map((node) => {
            this.buildNames.map((name, index) => {
              if (index > 0 && node.name === name) {
                total += node.value;
                links.unshift({
                  target: node.name,
                  source: this.buildNames[0],
                  value: node.value,
                });
              }
              return name;
            });
            return node;
          });
          nodes.unshift({
            name: this.buildNames[0],
            value: total,
          });
        }
        this.setState({
          nodes: nodes,
          links: links,
        });
      }
    });
  }
}

export default FlowDiagram;
